define([
    'visit-plan/status-bar',
    'visit-plan/count-bar'
], function (StatusBar, CountBar) {
    var PlanSidebar = {
        name: 'plan-sidebar',
        template: ''
        + '<div class="plan-sidebar">'
        + '<div class="plan-count-wrapper">'
        + '<p class="total-text">{{ month }}总览</p>'
        + '<count-bar :count-data="monthTotal"></count-bar>'
        + '</div>'
        + '<div class="plan-items">'
        + '<p class="month-text" v-show="planData.val">{{ monthDay }}</p>'
        + '<status-bar v-for="(item, index) in planData.planItem" :key="index" :type="item.type" :status="item.status">{{ item.name }}</status-bar>'
        + '</div>'
        + '</div>',
        components: {
            StatusBar: StatusBar,
            CountBar: CountBar
        },
        props: {
            planData: {
                type: Object,
                default: function () {
                    return {};
                }
            },
            date: String,
            monthTotal: {
                type: Object,
                default: function () {
                    return {};
                }
            }
        },

        data: function () {
            return {}
        },

        computed: {
            month: function () {
                return this.date.substring(this.date.indexOf('-') + 1) + '月';
            },
            monthDay: function () {
                return this.month + '月' + this.planData.val + '日';
            }
        }
    };

    return PlanSidebar;
});
